@charset "UTF-8";
/**文字立体阴影*/
/**logo*/
.logo {
  -webkit-box-reflect: below 10px linear-gradient(transparent, transparent, transparent, rgba(0, 0, 0, 0.8));
  opacity: 0.8;
  transition: all 1s;
}

.logo:hover {
  opacity: 1;
  filter: brightness-contrast(1.5, 1);
}

/*标题*/
.title {
  font-size: 120px;
  line-height: 120px;
  font-weight: bold;
  color: #fdd247;
  transform: skewX(-10deg);
  white-space: nowrap;
  letter-spacing: 4px;
  text-shadow: 0px 0px #8e733e, 0.5px 0.25px rgba(141, 115, 63, 0.975), 1px 0.5px rgba(140, 115, 64, 0.95), 1.5px 0.75px rgba(139, 114, 65, 0.925), 2px 1px rgba(138, 114, 66, 0.9), 2.5px 1.25px rgba(137, 114, 67, 0.875), 3px 1.5px rgba(136, 113, 68, 0.85), 3.5px 1.75px rgba(135, 113, 69, 0.825), 4px 2px rgba(134, 113, 70, 0.8), 4.5px 2.25px rgba(133, 112, 71, 0.775), 5px 2.5px rgba(132, 112, 72, 0.75), 5.5px 2.75px rgba(131, 112, 73, 0.725), 6px 3px rgba(130, 111, 74, 0.7), 6.5px 3.25px rgba(129, 111, 75, 0.675), 7px 3.5px rgba(128, 111, 77, 0.65), 7.5px 3.75px rgba(126, 110, 78, 0.625), 8px 4px rgba(125, 110, 79, 0.6), 8.5px 4.25px rgba(124, 109, 80, 0.575), 9px 4.5px rgba(123, 109, 81, 0.55), 9.5px 4.75px rgba(122, 109, 82, 0.525), 10px 5px rgba(121, 108, 83, 0.5), 10.5px 5.25px rgba(120, 108, 84, 0.475), 11px 5.5px rgba(119, 108, 85, 0.45), 11.5px 5.75px rgba(118, 107, 86, 0.425), 12px 6px rgba(117, 107, 87, 0.4), 12.5px 6.25px rgba(116, 107, 88, 0.375), 13px 6.5px rgba(115, 106, 89, 0.35), 13.5px 6.75px rgba(114, 106, 90, 0.325), 14px 7px rgba(113, 106, 91, 0.3), 14.5px 7.25px rgba(112, 105, 92, 0.275), 15px 7.5px rgba(111, 105, 93, 0.25), 15.5px 7.75px rgba(110, 105, 94, 0.225), 16px 8px rgba(109, 104, 95, 0.2), 16.5px 8.25px rgba(108, 104, 96, 0.175), 17px 8.5px rgba(107, 104, 97, 0.15), 17.5px 8.75px rgba(106, 103, 98, 0.125), 18px 9px rgba(105, 103, 99, 0.1), 18.5px 9.25px rgba(104, 103, 100, 0.075), 19px 9.5px rgba(103, 102, 101, 0.05), 19.5px 9.75px rgba(102, 102, 102, 0.025), 20px 10px rgba(102, 102, 102, 0);
  -webkit-box-reflect: below 5px linear-gradient(transparent 40%, rgba(0, 0, 0, 0.8));
  filter: contrast(5);
  transition: 2s;
  animation: colorChange 5s infinite linear alternate;
}

@keyframes colorChange {
  0% {
    color: #0b94d6;
    filter: contrast(1);
  }
  2% {
    color: #0b94d6;
    filter: contrast(1);
  }
  98% {
    color: #fdd247;
    filter: contrast(5);
  }
  100% {
    color: #fdd247;
    filter: contrast(5);
  }
}

/*背景的canvas*/
#backCanvas {
  filter: drop-shadow(0 0 1px white);
}

.cardOut {
  transform-style: preserve-3d;
  text-align: center;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  margin-top: 100px;
}
